我是個對網頁設計充滿好奇,過去總是覺得這領域很高深,但今天,我決定踏出這一步,挑戰用30天的時間,從零開始打造一個屬於自己的作品集。
今天的任務很簡單,就是寫出我們人生中的第一行程式碼!網頁的基礎,是由 HTML (HyperText Markup Language) 組成的。它就像房子的骨架,所有內容都得靠它來支撐。
我們會需要一個文字編輯器,像是 VS Code,這是我們接下來 30 天的好夥伴。然後建立一個新的檔案,命名為 index.html。
HTML
<!DOCTYPE html>
<html>
<head>
<title>我的第一個網頁</title>
</head>
<body>
<h1>Hello, World!</h1>
<p>這是我的第一個網頁,我很興奮能開始這段旅程!</p>
</body>
</html>
程式碼拆解:
<!DOCTYPE html>
:告訴瀏覽器這是一個 HTML5 文件。
<html>
:整個網頁的根元素。
<head>
:網頁的設定區,像是標題 <title>
,使用者在瀏覽器分頁上看到的文字就是它。
<body>
:網頁的內容區,所有你想讓使用者看到的內容,例如文字、圖片、連結,都放在這裡。
<h1>
:標題標籤,從 h1 到 h6,數字越小,標題越大。
<p>
:段落標籤,用來放一般的文字段落。
保存檔案後,用瀏覽器打開它,你就會看到「Hello, World!」和一行文字。
執行成果: